<template>
	<view class="container">
		<u-navbar title='个人笔记' :title-bold='true' :border-bottom='false' ></u-navbar>
		
		
		<view style="min-height: 80vh;">
			<view class="card" v-for="(item,index) in list" :key="index" @click="goTo(item.id)">
				<view class="c0">
					<view class="c1">
						<view class="icn">
						</view>
						<span class="title">{{item.title}}</span>
					</view>
					<image @click.stop="del(item)" class="eidt" src="@/static/icon/del2.png" mode=""></image>
				</view>
				<view class="c1">
					<span class="time">{{item.updatetime}} {{item.content}}</span>
				</view>
			</view>
		</view>
		<view class="bto">
			<navigator class="btn" url="addNote">新建笔记</navigator>
		</view>
	
		<!--  -->
		
		<!-- 提示 -->
		<u-toast ref="uToast" />
		<u-modal v-model="show" :content="content" @confirm='removeMember' @cancel='cancellation' :mask-close-able="true" :show-cancel-button='true' ></u-modal>
	</view>
</template>

<script>
	import {noteList,delNote } from '@/api/index.js'
	export default{
		data(){
			return{
				list:[],
				show:false,
				content:'',
				removeId:'',
				choose:false
			}
		},
		onLoad(e) {
			if(e.c) this.choose=true
		},
		onShow() {
			this.init()
		},
		methods:{
			goTo(id){
				if(this.choose){
					let page = getCurrentPages()
					let  prevpage=page[page.length-2]
					prevpage.$vm.note(id)
					uni.navigateBack({
						delta:1
					})
				}else{
					uni.navigateTo({
						url: '/sub/center/mine/noteDetail?id='+id
					})
				}
			},
			removeMember(){
				let that=this
				delNote({'id':that.removeId}).then(res=>{
					if(res.code==1){
						that.init()
					}else{
						that.$refs.uToast.show({
							title: res.msg
						})
					}
				})
			},
			cancellation(){
				this.show=false
				this.content=''
				this.removeId=''
			},
			del(item){
				this.show=true
				this.content='确定要删除【'+item.title+'】吗？'
				this.removeId=item.id
			},
			init(){
				let that=this
				noteList({id:that.removeId}).then(res=>{
					if(res && res.code==1){
						that.list=res.data.list
					}else{
						that.$refs.uToast.show({
							title: res.msg
						})
					}
				})
			}
		}
	}
</script>

<style lang="less" scoped>
	.container{
		padding:0 30rpx;
		.bto{
			width: 100%;
			position: sticky;
			bottom: 20rpx;
			left: 0;
		}
		.card{
			background-color: #FFF;
			border-radius: 10rpx;
			padding:30rpx;
			margin-top: 20rpx;
			.c0{
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 16rpx;
			}
			.c1{
				display: flex;
				align-items: center;
				.icn{
					width: 6px;height: 6px;
					border-radius: 50%;
					background-color: #6EC9E1;
					margin-right: 20rpx;
				}
			}
			.eidt{
				height: 16px;width: 16px;
				padding:0 20rpx;
			}
			.title{
				font-weight: bold;
				font-size: 16px;
			}
			.time{
				margin-left: 16px;
				color: #898989;font-size: 13px;
			}
		}
		

	}
</style>